<template>
  <div id="login">
      <form action="#">
          <p><input type="text" placeholder="账号/手机号/邮箱" ></p>
          <p><input type="password" placeholder="请输入您的密码"></p>
          <p><button>登录</button></p>
      </form>
      <p class="find-password">
          <span>立即注册</span>
          <span>找回密码</span>
      </p>
  </div>
</template>

<script>
export default {
    name:'Login',
    data(){
        return{

        }
    }
}
</script>

<style scoped>
#login{
    padding-top: 50px;
    width: 100%;
}
#login input{
    display: block;
    width: 95%;
    height: 40px;
    border: none;
    border-bottom: 1px solid #ccc;
    margin: 10px auto;
    outline: none;
}
#login button{
    display: block;
    width: 90%;
    border-radius: 5px;
    color: white;
    border: none;
    margin: 5px auto;
    height: 40px;
    font-size: 20px;
    background: #e54847;
}
.find-password span{
    color:#e54847;
}
.find-password span:first-child{
    float: left;
    margin-left: 10px;
}
.find-password span:last-child{
    float: right;
    margin-right: 10px;
}
</style>